/*----------------------------页面区域---------------------------------*/
<template>
    <el-card>
        <template #header>
            <div class="card-header">
                <span>model分页结构体</span>
                <el-button class="button" type="text" @click="selectText">选中文本</el-button>
                <el-button class="button" type="text" @click="copyCode">一键复制</el-button>
            </div>
        </template>
        <div class="gfcodeboxmodel">
    <pre ref="gfcode" class="gfcode">
// 分页结构体
type Page struct {
	Title interface{} `json:"title" in:"query"   dc:"筛选条件"`
	From  int         `json:"from"  in:"query"  v:"bail|required|integer" dc:"页数"`
	Limit int         `json:"limit" in:"query"  v:"bail|required|integer" dc:"条数"`
}
    </pre>            
        </div>

    </el-card>
</template>
/*----------------------------逻辑区域---------------------------------*/
<script setup>
import {ref,getCurrentInstance  } from 'vue'
const { proxy } = getCurrentInstance()
const gfcode = ref(null)
const props = defineProps({
    data: {
        type: Object
    }
})
function copyCode(){
    proxy.$copyText(gfcode.value.innerHTML).then(function (e) {
          proxy.$message.success('复制成功')
          console.log(e)
        }, function (e) {
          proxy.$message.error("复制失败")
          console.log(e)
        })
}
function selectText(){
    var range = document.createRange();
    var referenceNode =  document.getElementsByClassName("gfcodeboxmodel").item(0); 
    console.log(referenceNode);
    range.selectNodeContents(referenceNode);
    var selection = window.getSelection();
    selection.removeAllRanges();
    selection.addRange(range) 
}
</script>
<style lang="scss" scoped>
.card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.text {
    font-size: 14px;
}
.item {
    margin-bottom: 18px;
}
.box-card {
    width: 480px;
}
.gfcode {
    background-color: #f3f4f6;
    padding: 20px;
}
</style>

